<template>
  <div>
    <FormTable :formData="formData"
               :columnData="columnData"
               :url="$api.rights_getlist"
               :editData="editData"
               :new_url="this.$api.rights_insert"
               :detail_url="this.$api.rights_info"
               :edit_url="this.$api.rights_save"
               :pageConfig="pageConfig"></FormTable>
  </div>
</template>

<script>
export default {
  data () {
    return {
      formData: [
        {
          name: "category_id",
          label: "权益分类",
          value: 0,
          type: "select",
          groups: [
            {
              label: '所有',
              value: 0
            }
          ]
        },
        {
          name: "name",
          label: "权益名称",
          value: "",
          type: "input",
        },
        {
          name: "is_free",
          label: "是否免费分类",
          value: '',
          type: "select",
          groups: [
            {
              label: '所有',
              value: ''
            },
            {
              label: '是',
              value: 1
            },
            {
              label: '否',
              value: 0
            },
          ]
        },
        {
          name: "is_hot",
          label: "是否热门",
          value: '',
          type: "select",
          groups: [
            {
              label: '所有',
              value: ''
            },
            {
              label: '是',
              value: 1
            },
            {
              label: '否',
              value: 0
            },
          ]
        },
        {
          name: "is_search_hot",
          label: "是否热门搜索",
          value: '',
          type: "select",
          groups: [
            {
              label: '所有',
              value: ''
            },
            {
              label: '是',
              value: 1
            },
            {
              label: '否',
              value: 0
            },
          ]
        },
      ],
      columnData: [
        {
          prop: "rights_id",
          label: "id"
        },
        {
          prop: "name",
          label: "名称"
        },
        {
          prop: "category_name",
          label: "分类"
        },
        {
          prop: "discount",
          label: "折扣"
        },
        {
          prop: "icon_url",
          label: "icon",
          custom: true,
          type: 'icon',
        },
        {
          prop: "display",
          label: "是否显示",
          custom: true,
          type: 'switch',
          url: this.$api.rights_status
        },
        {
          prop: "sort",
          label: "排序",
          custom: true,
          type: 'input',
          url: this.$api.rights_sort
        },
        {
          prop: "isfree",
          label: "是否免费分类",
          custom: true,
          type: 'status',
          active_val:'1',
          active_text:'是',
          active_not_text:'否'
        },
        {
          prop: "is_hot",
          label: "是否热门",
          custom: true,
          type: 'switch',
          url: this.$api.rights_hot
        },
        {
          prop: "is_search_hot",
          label: "是否热门搜索",
          custom: true,
          type: 'switch',
          url: this.$api.rights_searchHot
        },
        {
          prop: 'btn_group',
          label: '操作',
          custom: true,
          type: 'btn_group',
          width:'200px',
          group: [
            {
              name: '编辑',
              type: 'edit',
              color: 'primary',
              detail_mark: 'rights_id',
            },
            {
              name: '删除',
              type: 'delete',
              color: 'danger',
              url: this.$api.rights_status
            }
          ]
        }
      ],
      editData: [
        {
          name: 'pid',
          label: '权益分类',
          value: '',
          type: 'select',
          groups: [],
          span: 18,
          add_url:this.$api.category_getnopagelist,
          url_rule: {
            rule: 'isfree',
            labelKey:'name',
            valueKey:'category_id',
            url: [
              `${this.$api.category_getnopagelist}?isfree=0`,
              `${this.$api.category_getnopagelist}?isfree=1`
            ]
          },
          rules:[
            { required: true, message: "请选择权益分类", trigger: "blur" },
          ]
        },
        {
          name: 'name',
          label: '名称',
          value: '',
          type: 'input',
          rules:[
            { required: true, message: "请输入权益名称", trigger: "blur" },
          ]
        },
        {
          name: 'description',
          label: '描述',
          value: '',
          type: 'input',
          rules:[
            { required: true, message: "请输入权益描述", trigger: "blur" },
          ]
        },
        {
          name: 'discount',
          label: '折扣',
          value: '',
          type: 'input',
          rules:[
            { required: true, message: "请输入折扣", trigger: "blur" },
          ]
        },
        {
          name: 'sort',
          label: '排序',
          value: '',
          type: 'input',
        },
        {
          name: 'display',
          label: '是否显示',
          value: '',
          type: 'switch',
          config: {
            'active_value': '1',
            'inactive-value': '0'
          }
        },
        {
          name: 'is_hot',
          label: '是否热门',
          value: '',
          type: 'switch',
          config: {
            'active_value': '1',
            'inactive-value': '0'
          }
        },
        {
          name: 'is_search_hot',
          label: '是否热门搜索',
          value: '',
          type: 'switch',
          config: {
            'active_value': '1',
            'inactive-value': '0'
          }
        },
        {
          name: 'icon_url',
          label: '图标',
          value: '',
          type: 'image_upload',
          width:'100%',
          config: {
            limit: 1,
            accept: ".jpg,.png,.bmp,.gif,.svg",
            fileList: []
            // is_icon:true
          },
          rules:[
            { required: true, message: "请添加权益图标", trigger: "blur" },
          ]
        },
        {
          name: 'note_content',
          label: '说明内容',
          value: '',
          type: 'editor',
          width: 640
        },
        {
          name: 'note_id',
          label: '说明id',
          value: '',
          type: 'input',
          display:'none'
        },
        {
          name: 'rights_id',
          label: '权益id',
          value: '',
          type: 'input',
          display:'none'
        }
      ],
      pageConfig: {
        page: 1,
        pagesize: 10,
      }
    };
  },
  created () {
    this.category_getlist();
  },
  methods: {
    // 获取权益分类
    category_getlist () {
      this.$req.get(this.$api.category_getnopagelist).then(res => {
        console.log(res);
        let data = res.data;
        for (var i in data) {
          this.formData[0].groups.push({
            label: data[i].name,
            value: data[i].category_id
          })
        }
      })
    },
    handleSizeChange (e) {
      console.log(e);
    },
    handleCurrentChange (e) {
      console.log(e);
    },
    submit (e) {
      console.log(e);
    },
    reset (e) {
      console.log(e);
    }
  }
}
</script>

<style lang="scss" scoped>
</style>